<template>
  <CommonLayout current-path="/politics">
    <!-- 功能卡片区域 -->
    <div class="container">
      <router-link 
        v-for="card in functionCards" 
        :key="card.path"
        :to="card.path" 
        class="text-decoration-none"
      >
        <div class="card" :class="card.bgColor">
          <div class="card-body">
            <h5 class="card-title">{{ card.title }}</h5>
            <p class="card-text">{{ card.description }}</p>
          </div>
        </div>
      </router-link>
    </div>
  </CommonLayout>
</template>

<script>
import CommonLayout from '@/components/layout/CommonLayout.vue'

export default {
  name: 'PoliticsView',
  components: {
    CommonLayout
  },
  data() {
    return {
      functionCards: [
        {
          title: '历年政治真题',
          description: '覆盖98-24年，系统练习、查漏补缺',
          path: '/politics/real',
          bgColor: 'bg-primary text-white'
        },
        {
          title: '专项练习',
          description: '马原、毛中特、史纲等专项训练',
          path: '/politics/special',
          bgColor: 'bg-success text-white'
        },
        {
          title: '错题本',
          description: '记录做错的题目，针对性复习',
          path: '/politics/wrong',
          bgColor: 'bg-danger text-white'
        },
        {
          title: 'AI智能练习',
          description: '基于错题智能推荐相似题目',
          path: '/politics/ai',
          bgColor: 'bg-info text-white'
        }
      ]
    }
  }
}
</script>

<style scoped>
.card {
  border-radius: 12px;
  margin-bottom: 15px;
}

:root {
  --theme-color: #B19CD9;
}
</style> 